import React, { memo } from "react";

import { NavLink } from "react-router-dom"
import { renderRoutes } from "react-router-config";
import { dicoverMenu } from "../../services/local-data";

import { DiscoverWrapper, TopMenu } from "./style";

export default memo(function GHDiscover(props) {
  const { route } = props
  return (
    <DiscoverWrapper>
      <div className="top">
        <TopMenu className="warp-v1">
          {
            dicoverMenu.map((item, index) => {
              return (
                <div className="item" key={item.title}>
                  <NavLink to={item.link}><em>{item.title}</em></NavLink>
                </div>
              )
            })
          }
        </TopMenu>
      </div>
      {renderRoutes(route.routes)}
    </DiscoverWrapper>
  )
})